import React from 'react';
import { inject,observer } from 'mobx-react';
import * as mobx from 'mobx';
import './index.less';
import { getAntd,getEcCom,getComsMobx,getLabel } from '../../../util/convert';

@inject('printLogStore')
@observer
export default class Main extends React.Component{
    componentDidMount(){
        const { printLogStore } = this.props;
        printLogStore.loadBaseInfo();
        printLogStore.doSearch();
    }
    componentWillUnmount(){
        const { printLogStore } = this.props;
        printLogStore.resetStatus();
    }
    render(){
        const { Button } = getAntd();
        const { WeaDialogFooter,WeaTab,WeaSearchGroup,WeaFormItem,WeaRightMenu } = getEcCom();
        const { WeaSwitch,WeaTableNew } = getComsMobx();
        const { printLogStore } = this.props;
        const { tabKey,topTab,showSearchAd,form,tableStore } = printLogStore;
        const formParams = form && form.getFormParams() || {};
        const WeaTable = WeaTableNew.WeaTable;
        return (
            <div className="wf-form-print-log">
                <div className="wf-form-print-log-list">
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@smhjch`} {...this.getMoreBtns()}>
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@p22nkx`}
                            buttonsAd={this.getAdButtons()}
                            searchType={['advanced']}
                            setShowSearchAd={bool=>{printLogStore.setShowSearchAd(bool)}}
                            hideSearchAd={()=> printLogStore.setShowSearchAd(false)}
                            searchsAd={this.getAdConditions()}
                            advanceHeight={170}
                            showSearchAd={showSearchAd}
                            datas={mobx.toJS(topTab)}
                            selectedKey={tabKey}
                            onSearch={v=>{printLogStore.doSearch()}}
                            onSearchChange={v=>{printLogStore.appendFormFields({requestname:{value:v}})}}
                            keyParam="viewcondition"  //主键
                            onChange={this.switchTab} 
                        />
                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@s4gp63`} comsWeaTableStore={tableStore} hasOrder={true} needScroll={true} />
                    </WeaRightMenu>
                </div>
                <WeaDialogFooter ecId={`${this && this.props && this.props.ecId || ''}_WeaDialogFooter@dhl3bl`} buttons={this.getButtons()} moreBtn={this.getMoreBtns()} />
            </div>
        )
    }
    getAdConditions(){
        const { WeaDialogFooter,WeaTab,WeaSearchGroup,WeaFormItem,WeaRightMenu } = getEcCom();
        const { WeaSwitch,WeaTableNew } = getComsMobx();
        const { printLogStore } = this.props;
        const { conditions,form } = printLogStore;
        let group = [];
        let items = [];
        const isFormInit = form && form.isFormInit || false;
        const formParams = form && form.getFormParams() || {};
        isFormInit && conditions.map(field =>{
            const domKey = typeof field.domkey === "object" ? field.domkey[0] : field.domkey;
            items.push({
                com:(<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@sxe6si@${domKey}`}
                    label={`${field.label}`}
                    labelCol={{span: `${field.labelcol}`}}
                    wrapperCol={{span: `${field.fieldcol}`}}>
                        <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@3dvrrz@${domKey}`} fieldConfig={field} form={form} formParams={formParams}/>
                    </WeaFormItem>),
                colSpan:1
            })
        });
        isFormInit && group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@wtkbg5@group1`} needTigger={false} showGroup={true} items={items}/>);
        return <div>{group}</div>;
    }
    switchTab = (tabKey) => {
        const { printLogStore } = this.props;
        printLogStore.switchTab(tabKey);
        printLogStore.doSearch();
    }
    getAdButtons(){
        const { Button } = getAntd();
        const { printLogStore } = this.props;
        const { doSearch,setShowSearchAd,clearFormFields} = printLogStore;
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@7n8hsu@search`} type="primary" onClick={()=>{doSearch();setShowSearchAd(false);}}>{getLabel(197,'搜索')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@yfwt58@reset`} type="ghost" onClick={()=>{clearFormFields();}}>{getLabel(2022,'重置')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@om56ot@cancel}`} type="ghost" onClick={()=>{setShowSearchAd(false)}}>{getLabel(31129,'取消')}</Button>)
        ];
    }
    getButtons(){
        let buttons = [];
        return buttons;
    }
    getMoreBtns(){
        let btns = [];
        return {datas:btns};
    }
    doCancel(){
        const { printLogStore } = this.props;
        printLogStore.closeEvent();
    }
}